<template>
  <view class="bg-white  radius margin-xs">
    <z-paging ref="pagingRef" v-model="list" @query="queryList">
      <template #top>
        <MrCustom bg-color="bg-gradual-blue " is-back>
          <template #backText>
            返回
          </template>
        </MrCustom>
      </template>
      <view class="cu-list menu-avatar">
        <view class="cu-item " v-for="(item,index) in list" :key="index" @click="toDetail(item)">
          <view class="cu-avatar round lg"
                :style="'background-image:url('+prefix+item.fromAvatar+');'">
            <view v-if="item.isRead===0" class="cu-tag badge">new</view>
          </view>
          <view class="content">
            <view class="text-lg text-bold">
              {{ item.fromUsername }}
            </view>
            <view class="text-cut" style="width: 60vw">
              <text v-if="item.targetType===1">评价诊断:</text>
              <text v-if="item.targetType===2">评论文章:</text>
              <text v-else>{{item.targetType}}:</text>

              <text class="text-gray">{{ item.content }}</text>
            </view>
<!--            <view class="text-black"> {{ item.content }}</view>-->
          </view>
          <view class="action text-xxl text-black">
            <view class="text-green  text-sm text-center" @click="toDetail(item)">
              详情
            </view>
            <view class="text-gray text-sm">
              <view>{{ myMoment(item.createTime).format("M-D HH:mm") }}</view>
            </view>
          </view>
        </view>
      </view>
    </z-paging>
  </view>
</template>

<script setup lang="ts">
import {defineExpose, ref} from "vue";
import api from "@/api";
import {useUserStore} from "@/store";
import {onLoad} from "@dcloudio/uni-app";
import myMoment from "@/utils/common/myMoment";
import {imagePathPrefix} from '/settings'
import MrCustom from "@/components/common/MrCustom.vue";

const prefix = imagePathPrefix

onLoad((option) => {
  commentNoReadNum.value = option.commentNoReadNum
})


const commentNoReadNum = ref(0)
const userStore = useUserStore()
const pagingRef = ref()
const list = ref()

const toDetail = (item: any) => {
  uni.navigateTo({
    url: '/pages/user/message/comment/detail?commentRootInfo=' + encodeURIComponent(JSON.stringify(item))
  })
  item.isRead = 1
}

const andParams = ref({
  toUsername: userStore.userInfo.username
})
const orParams = ref({})
const orderParams = ref({
  createTime: 2
})


const queryList = (pageNo: any, pageSize: any) => {
  api.comment.commentRootQueryList({
    pageNo: pageNo,
    pageSize: pageSize,
    andParams: JSON.stringify(andParams.value),
    orParams: JSON.stringify(orParams.value),
    orderParams: JSON.stringify(orderParams.value)
  }).then(res => {
    if (res && res.data.code === 0) {
      let tmp = res.data.data.records
      pagingRef.value.complete(tmp);
    }
  })
}
const pageReload = () => {
  pagingRef.value.reload()
}

defineExpose({
  pageReload
})
</script>

<style scoped>

</style>